<template>
	<view class="conbox">
		<view class="pd30 flex-row wrap" v-if="props.list.length">
			<view v-for="(v,i) in props.list" :key="i" class="proitem" :id="`proitem_${i+1}`" @click="proxy.$c.go_url(`/pages/productDetail?id=${v.product_id}&size_id=${v.size_id}`)">
				<view class="coverbox"><image class="cover" :src="v.imgs.cover" mode="aspectFill"></image></view>
				<view class="pd20-column">
					<view class="itemtitle lineOne">{{v.title}}</view>
					<view class="price" v-if="v.price">
						<text>¥{{v.price}}</text>
						<text class="desc">元/{{v.unit_}}</text>
					</view>
				</view>
			</view>
		</view>
		<view v-if="!props.list.length" class="pd30"><view class="nodata">暂无数据</view></view>
	</view>
</template>

<script setup>
    import { reactive, getCurrentInstance,onMounted } from 'vue'
	import { onLoad,onTabItemTap,onReachBottom,onPullDownRefresh,onPageScroll } from '@dcloudio/uni-app';
	import dayjs from 'dayjs'
    let { proxy } = getCurrentInstance()
	const props = defineProps({
		list: {
			type: Array,
			default: ()=>{
				return []
			}
		}
	})
	
	let obj = reactive({
		list: [],
	})
	
	onMounted(()=>{
		init()
	})
	
	const init=()=>{
	}
</script>

<style lang="scss" scoped>
.conbox{
	width: 100%;
	.proitem{
		width: 330rpx;margin-right: 30rpx;border-radius: 25rpx;overflow: hidden;
		margin-bottom: 40rpx;
		.swiper,.swiper-item{
			width: 330rpx !important;height: 330rpx !important;border-radius: 15rpx;overflow: hidden;
			image{width: 100%;height: 100%;}
		}
		.coverbox{width: 330rpx;height: 330rpx;border-radius: 25rpx;overflow: hidden; background-color: #f0f0f0;border: solid 1rpx #f3f3f3;box-sizing: border-box;}
		.cover{width: 100%;height: 100%;}
		.itemtitle{font-size: 27rpx;color: #333;font-weight: 400;}
		.price{
			font-size: 38rpx;color: #333;font-weight: bold;
			.desc{font-size: 26rpx;font-weight: 400;color: #999;margin-left: 5rpx;}
		}
		.min_nums{font-size: 27rpx;color: #333;font-weight: 400;}
	}
	.proitem:nth-child(2n){margin-right: 0;}
	.nodata{width: 100%;height: 100rpx;text-align: center;line-height: 100rpx;border-radius: 10rpx;background: #f0f0f0;font-size: 22rpx;color: #999;}
}
</style>
